<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <title>qwq</title>
    <script src="vue.min.js"></script>
    <link href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" rel="stylesheet">
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <style>
    </style>
</head>

<body>
<div id="app">
    <el-col :span="24">
        <div class="grid-content bg-purple-light">
            <el-card class="box-card">
                <div slot="header">
                    <span>英雄联盟小助手2.0</span>
                </div>
                <el-tabs type="border-card">
                    <el-tab-pane label="玩家信息">
                        <el-col :span="6">
                            <el-col>
                                <el-image :src="avatarImgUrl" fit="conver"
                                          style="width: 200px; height: 200px"></el-image>
                            </el-col>
                        </el-col>
                        <el-col :span="18">
                            <br>
                            <div>
                                召唤师名字:&nbsp;&nbsp;&nbsp;{{currentSummonerInfo.name}}
                            </div>
                            <br>
                            <div>
                                召唤师大区:&nbsp;&nbsp;&nbsp;{{currentSummonerInfo.area}}
                            </div>
                            <br>
                            <div>
                                召唤师等级:&nbsp;&nbsp;&nbsp;{{currentSummonerInfo.level}}
                            </div>
                            <br>
                            <div>
                                召唤师单双:&nbsp;&nbsp;&nbsp;{{currentSummonerInfo.rankedSoloRank}}
                            </div>
                            <br>
                            <div>
                                召唤师灵活:&nbsp;&nbsp;&nbsp;{{currentSummonerInfo.rankedLingHuoRank}}
                            </div>
                        </el-col>
                    </el-tab-pane>
                    <el-tab-pane label="战绩查询">
                        <el-card class="box-card">
                            <div class="clearfix" slot="header">
                                <span>选英雄时查询队友战绩</span>
                            </div>
                            <el-form :model="gameRecord" ref="gameRecord">
                                <el-form-item label="发送战绩给队友看">
                                    <el-switch v-model="gameRecord.isSendToTeammate"></el-switch>
                                </el-form-item>
                                <el-form-item label="等级评价(kda从低到高,|分割)">
                                    <el-input placeholder="" v-model="gameRecord.levelList"></el-input>
                                </el-form-item>
                                <el-form-item label="选英雄时">
                                    <br>
                                    <el-button @click="analyseGameRecord(false)" type="success">分析队友战绩</el-button>
                                </el-form-item>
                                <el-form-item label="游戏开始,进入泉水后">
                                    <br>
                                    <el-button @click="analyseGameRecord(true)" type="danger">分析敌方战绩</el-button>
                                </el-form-item>
                            </el-form>
                            <div>队友战绩:</div>
                            <el-divider></el-divider>
                            <el-table :data="myTeamData" border height="" style="width: 100%">
                                <el-table-column label="召唤师名字" prop="summonerName" width="250">
                                </el-table-column>
                                <el-table-column label="单双" prop="rankedSoloRank">
                                </el-table-column>
                                <el-table-column label="灵活" prop="rankedLingHuoRank">
                                </el-table-column>
                                <el-table-column label="战绩详情" prop="groupData">
                                </el-table-column>
                                <el-table-column label="平均kda" prop="avgKda">
                                </el-table-column>
                                <el-table-column label="评分" prop="assessment">
                                </el-table-column>
                            </el-table>
                            <div>敌方战绩:</div>
                            <el-divider></el-divider>
                            <el-table :data="otherTeamData" border height="" style="width: 100%">
                                <el-table-column label="召唤师名字" prop="summonerName" width="250">
                                </el-table-column>
                                <el-table-column label="单双" prop="rankedSoloRank">
                                </el-table-column>
                                <el-table-column label="灵活" prop="rankedLingHuoRank">
                                </el-table-column>
                                <el-table-column label="战绩详情" prop="groupData">
                                </el-table-column>
                                <el-table-column label="平均kda" prop="avgKda">
                                </el-table-column>
                                <el-table-column label="评分" prop="assessment">
                                </el-table-column>
                            </el-table>
                        </el-card>
                    </el-tab-pane>
                    <el-tab-pane label="段位修改">
                        类型:&nbsp;&nbsp;
                        <el-select placeholder="请选择" style="width: 100px" v-model="rankedInfo.rankedLeagueQueue">
                            <el-option key="RANKED_SOLO_5x5" label="单双" value="RANKED_SOLO_5x5"></el-option>
                            <el-option key="RANKED_FLEX_SR" label="灵活" value="RANKED_FLEX_SR"></el-option>
                        </el-select>
                        段位:&nbsp;&nbsp;
                        <el-select placeholder="请选择" style="width: 100px" v-model="rankedInfo.rankedLeagueTier">
                            <el-option key="IRON" label="坚韧黑铁" value="IRON"></el-option>
                            <el-option key="BRONZE" label="英勇黄铜" value="BRONZE"></el-option>
                            <el-option key="SILVER" label="不屈白银" value="SILVER"></el-option>
                            <el-option key="GOLD" label="荣耀黄金" value="GOLD"></el-option>
                            <el-option key="PLATINUM" label="华贵铂金" value="PLATINUM"></el-option>
                            <el-option key="DIAMOND" label="璀璨钻石" value="DIAMOND"></el-option>
                            <el-option key="MASTER" label="超凡大师" value="MASTER"></el-option>
                            <el-option key="GRANDMASTER" label="傲世宗师" value="GRANDMASTER"></el-option>
                            <el-option key="CHALLENGER" label="最强王者" value="CHALLENGER"></el-option>
                        </el-select>
                        <el-select placeholder="请选择" style="width: 100px" v-model="rankedInfo.rankedLeagueDivision">
                            <el-option key="Ⅴ" label="Ⅴ" value="Ⅴ"></el-option>
                            <el-option key="Ⅳ" label="Ⅳ" value="Ⅳ"></el-option>
                            <el-option key="Ⅲ" label="Ⅲ" value="Ⅲ"></el-option>
                            <el-option key="Ⅱ" label="Ⅱ" value="Ⅱ"></el-option>
                            <el-option key="Ⅰ" label="Ⅰ" value="Ⅰ"></el-option>
                        </el-select>
                        &nbsp;&nbsp;&nbsp;&nbsp;<el-button @click="updateRanked" type="primary">修改</el-button>
                    </el-tab-pane>
                </el-tabs>
            </el-card>
        </div>
    </el-col>
</div>
<script>
    var app = new Vue({
        el: '#app',
        data: {
            currentSummonerInfo: {},
            avatarImgUrl: "",
            gameRecord: {
                isSendToTeammate: true,
                levelList: "没有马|牛马|中等马|上等马|赤兔马"
            },
            myTeamData: [],
            otherTeamData: [],
            rankedInfo: {
                rankedLeagueQueue: '',
                rankedLeagueTier: '',
                rankedLeagueDivision: null
            }
        },
        methods: {
            // 获取当前登陆召唤师信息
            getCurrentSummonerInfo() {
                axios.get('http://localhost:8080/app/current/summoner/info')
                    .then(response => {
                        if (response.data.success && response.data.errorCode === 0) {
                            this.currentSummonerInfo = response.data.result;
                            this.avatarImgUrl = "http://localhost:8080/lcu/avatar?id=" + this.currentSummonerInfo.profileIconId;

                            this.currentSummonerInfo.rankedSoloRank = this.currentSummonerInfo.rankedSolo.rank;
                            if (this.currentSummonerInfo.rankedSolo.rank !== '未完成定位赛') {
                                this.currentSummonerInfo.rankedSoloRank =
                                    this.currentSummonerInfo.rankedSolo.rank
                                    + '  胜点:' + this.currentSummonerInfo.rankedSolo.point
                                    + '  胜场:' + this.currentSummonerInfo.rankedSolo.win;
                            }
                            this.currentSummonerInfo.rankedLingHuoRank = this.currentSummonerInfo.rankedLingHuo.rank;
                            if (this.currentSummonerInfo.rankedLingHuo.rank !== '未完成定位赛') {
                                this.currentSummonerInfo.rankedLingHuoRank =
                                    this.currentSummonerInfo.rankedLingHuo.rank
                                    + '  胜点:' + this.currentSummonerInfo.rankedLingHuo.point
                                    + '  胜场:' + this.currentSummonerInfo.rankedLingHuo.win;
                            }
                        } else {
                            this.$message('获取当前登陆召唤师信息失败,code:' + response.data.errorCode, +"msg:" + response.data.message);
                        }
                    })
                    .catch(error => {
                        this.$message('axios获取召唤师信息异常')
                        console.log(error)
                    });
            },
            // 战绩分析
            analyseGameRecord(isInGame) {
                console.log(this.gameRecord.isSendToTeammate)
                const requestData = {
                    sendToTeammate: this.gameRecord.isSendToTeammate,
                    levelList: this.gameRecord.levelList.split("|"),
                    inGame: isInGame
                };
                axios.post('http://localhost:8080/app/game/record/analyse', requestData)
                    .then(response => {
                        if (response.data.success && response.data.errorCode === 0) {
                            response.data.result.forEach(temp => {
                                const gameDetails = temp.gameDetails;
                                temp.groupData = '';
                                temp.rankedSoloRank = temp.rankedSolo.rank;
                                if (temp.rankedSolo.rank !== '未完成定位赛') {
                                    temp.rankedSoloRank =
                                        temp.rankedSolo.rank
                                        + '  胜点:' + temp.rankedSolo.point
                                        + '  胜场:' + temp.rankedSolo.win;
                                }

                                temp.rankedLingHuoRank = temp.rankedLingHuo.rank;
                                if (temp.rankedLingHuo.rank !== '未完成定位赛') {
                                    temp.rankedLingHuoRank =
                                        temp.rankedLingHuo.rank
                                        + '  胜点:' + temp.rankedLingHuo.point
                                        + '  胜场:' + temp.rankedLingHuo.win;
                                }
                                gameDetails.forEach(detail => {
                                    temp.groupData = temp.groupData + detail.championName + "(" + detail.kill + "-" + detail.death + "-" + detail.assist + ")" + " ";
                                })
                            });
                            if (isInGame) {
                                this.otherTeamData = response.data.result;
                            } else {
                                this.myTeamData = response.data.result;
                            }

                        } else {
                            this.$message('分析战绩失败,code:' + response.data.errorCode, +"msg:" + response.data.message);
                        }
                    })
                    .catch(error => {
                        this.$message('http请求失败')
                        console.log(error)
                    });
            },
            updateRanked() {
                const requestData = {
                    lol: this.rankedInfo
                };
                axios.put('http://localhost:8080/lcu/summoner/current/ranked', requestData).then(response => {
                    let message = '';
                    if (response.data.errorCode === 0 && response.data.success) {
                        message = '修改成功';
                    } else {
                        message = '修改失败,errorCode:' + response.data.errorCode + "msg:" + response.data.message;
                    }
                    const h = this.$createElement;
                    this.$notify({
                        title: '段位修改通知',
                        message: h('i', {style: 'color: teal'}, message)
                    });
                }).catch(error => {
                    this.$message('http请求失败')
                    console.log(error);
                })
            }
        },
        mounted: function () {
            this.getCurrentSummonerInfo();
        }
    })
</script>
</body>

</html>